<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        //被观察者实现的逻辑如下所示，简单代码如下所示
        class Subject{
            constructor(){
                this.observerList = [];
            }
            //加入观察者模式对象
            addObserver(observer){
                this.observerList.push(observer)
            }
            removeObserver(observer){
                let index = this.observerList.findIndex(item=>item.name === observer.name);

                this.observerList.splice(index,1);//删除监听列表的数据内容
            }
            //监听所有的数据
            notifyAll(message){
                //数据更新后通知所有的观察者。
                this.observerList.forEach(observer=>observer.notify(message));
            }
        }

        //观察者的逻辑如下所示
        class Observer{
            constructor(name,subject){
                this.name = name;

                //添加到被观察的队列中去
                if(subject){
                    subject.addObserver(this);
                }
            }
            //通知所有的被观察者信息
            notify(message){
                console.log(this.name,"获取信息是:",message);
            }
        }

        //实例化对象信息
        let subject = new Subject();
        let objectA = new Observer("objectA",subject);
        let objectB = new Observer("objectB",subject);

        subject.notifyAll("测试通知效果")

        subject.removeObserver(objectB);//移除
        subject.notifyAll("今天端午节放假")
    </script>
</body>
</html>